import 'package:color_dart/RgbaColor.dart';
import 'package:flutter/material.dart';
import 'package:im_flutter_sdk_example/components/my_underline_indicator.dart';
import 'package:im_flutter_sdk_example/jsonserialize/message/data.dart';
import 'package:im_flutter_sdk_example/pages/toolbar/alliance/widgets/empty.dart';
import 'package:im_flutter_sdk_example/pages/toolbar/alliance/widgets/project_expert.dart';
import 'package:im_flutter_sdk_example/pages/toolbar/alliance/widgets/timeline.dart';
import 'package:im_flutter_sdk_example/provider/group_formdate_model.dart';
import 'package:im_flutter_sdk_example/provider/group_message.dart';
import 'package:im_flutter_sdk_example/utils/global.dart';
import 'package:provider/provider.dart';
import 'widgets/alliance_mine.dart';
import 'package:im_flutter_sdk_example/utils/screen.dart';

class ActPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return ActState();
  }
}

class ActState extends State<ActPage> with SingleTickerProviderStateMixin {
  List<Choice> tabs = [
    Choice(title: '小组动态', icon: Icons.group, position: 0),
    Choice(title: '内容中心', icon: Icons.content_copy, position: 1),
    Choice(title: '小组圈子', icon: Icons.content_copy, position: 2),
  ];
  TabController mTabController;
  int mCurrentPosition = 0;
  List<Widget> tabPages = [TimeLineList(), ProjectList(), MyAlliance()];

  @override
  Widget build(BuildContext context) {
    // super.build(context);
    GroupFormDataModel _formData = Provider.of<GroupFormDataModel>(context);
    if (_formData.hasGroup == false) return EmptyAlliance();
    GroupMessageProvider groupProvider =
        Provider.of<GroupMessageProvider>(context);
    GroupMessage message = groupProvider.messageData;
    return Scaffold(
      body: NestedScrollView(
        headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
          return [
            SliverAppBar(
              automaticallyImplyLeading: false,
              pinned: true,
              expandedHeight: 350.0,
              bottom: PreferredSize(
                  child: Container(
                    width: double.infinity,
                    color: Colors.white,
                    child: TabBar(
                      indicator: MyUnderlineTabIndicator(
                          borderSide:
                              BorderSide(width: 2.0, color: Colors.blue)),
                      isScrollable: true,
                      indicatorSize: TabBarIndicatorSize.label,
                      indicatorColor: rgba(42, 125, 250, 1),
                      labelColor: rgba(51, 51, 51, 1),
                      unselectedLabelColor: rgba(136, 135, 135, 1),
                      indicatorWeight: 4.0.nsp,
                      tabs: tabs.map((Choice choice) {
                        return Tab(
                          text: choice.title,
                        );
                      }).toList(),
                      controller: mTabController,
                    ),
                  ),
                  preferredSize: Size(double.infinity, 0.0)),
              flexibleSpace: Column(
                children: <Widget>[
                  Expanded(
                    child: Stack(
                      children: [
                        Positioned(
                          left: 0,
                          right: 0,
                          top: 0,
                          bottom: 0,
                          child: Container(
                            child: Image.asset(
                              'lib/assets/images/mine/mine-head-bg.png',
                              fit: BoxFit.cover,
                            ),
                            width: double.infinity,
                          ),
                        ),
                        Positioned(
                          top: 100,
                          left: 0,
                          right: 0,
                          bottom: 0,
                          child: Container(color: Colors.white),
                        ),
                        Positioned(
                          top: 80,
                          left: 0,
                          right: 0,
                          bottom: 0,
                          child: Container(
                              height: 60,
                              padding: EdgeInsets.symmetric(horizontal: 20),
                              width: double.infinity,
                              color: Colors.transparent,
                              child: Column(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  Row(
                                    mainAxisAlignment:
                                        MainAxisAlignment.spaceBetween,
                                    children: [
                                      Container(
                                        width: 83,
                                        height: 83,
                                        decoration: BoxDecoration(
                                            shape: BoxShape.rectangle,
                                            color: rgba(255, 255, 255, 1),
                                            borderRadius: BorderRadius.all(
                                                Radius.circular(11)),
                                            boxShadow: [
                                              BoxShadow(
                                                  color: rgba(0, 0, 0, 0.05),
                                                  offset: Offset(
                                                      0.0, 4.0), //阴影xy轴偏移量
                                                  blurRadius: 8, //阴影模糊程度
                                                  spreadRadius: 1.0 //阴影扩散程度
                                                  )
                                            ]),
                                        child: SizedBox(
                                          width: 83,
                                          height: 83,
                                          child: Image.network(
                                            _formData.myGroup.logo,
                                            fit: BoxFit.cover,
                                          ),
                                        ),
                                      ),
                                      Container(
                                        width: 79,
                                        height: 26,
                                        decoration: BoxDecoration(
                                          borderRadius: BorderRadius.all(
                                              Radius.circular(3)),
                                          border: Border.all(
                                            color: rgba(42, 125, 250, 1),
                                            width: 1,
                                          ),
                                        ),
                                        child: GestureDetector(
                                          onTap: () =>
                                              {G.pushNamed('/alliance_manger')},
                                          child: Row(
                                            mainAxisAlignment:
                                                MainAxisAlignment.center,
                                            children: [
                                              Text('小组管理',
                                                  style: TextStyle(
                                                      fontSize: 13,
                                                      color: rgba(
                                                          42, 125, 250, 1)))
                                            ],
                                          ),
                                        ),
                                      ),
                                    ],
                                  ),
                                  Padding(
                                    padding: const EdgeInsets.symmetric(
                                        vertical: 10),
                                    child: Text(_formData.myGroup.name,
                                        maxLines: 1,
                                        style: TextStyle(
                                            color: rgba(51, 51, 51, 1),
                                            fontSize: 22,
                                            fontWeight: FontWeight.bold)),
                                  ),
                                  Container(
                                    margin:
                                        EdgeInsets.only(bottom: 20, top: 10),
                                    height: 56,
                                    padding: EdgeInsets.symmetric(vertical: 20),
                                    decoration: BoxDecoration(
                                      borderRadius:
                                          BorderRadius.all(Radius.circular(5)),
                                      color: rgba(247, 249, 252, 1),
                                    ),
                                    child: Row(
                                      mainAxisAlignment:
                                          MainAxisAlignment.spaceBetween,
                                      children: [
                                        Container(
                                          child: Row(
                                            children: [
                                              Text('小组',
                                                  style: TextStyle(
                                                      fontSize: 14,
                                                      fontWeight:
                                                          FontWeight.w600)),
                                              Text('通知',
                                                  style: TextStyle(
                                                      fontSize: 14,
                                                      fontWeight:
                                                          FontWeight.w600,
                                                      color: rgba(
                                                          25, 109, 236, 1))),
                                            ],
                                          ),
                                          padding: EdgeInsets.only(left: 19),
                                        ),
                                        message == null
                                            ? (Container())
                                            : Expanded(
                                                child: Container(
                                                  child: Text(
                                                      "${message.data[0].note}",
                                                      overflow:
                                                          TextOverflow.ellipsis,
                                                      style: TextStyle(
                                                          fontSize: 13,
                                                          fontWeight:
                                                              FontWeight.w600,
                                                          color: rgba(143, 155,
                                                              179, 1))),
                                                  padding: EdgeInsets.only(
                                                      right: 19),
                                                ),
                                              )
                                      ],
                                    ),
                                  ),
                                  Container(
                                    padding: EdgeInsets.only(
                                        left: 20, right: 0, bottom: 20),
                                    child: Row(
                                      mainAxisAlignment:
                                          MainAxisAlignment.spaceBetween,
                                      children: [
                                        Row(children: [
                                          ..._formData.groupManager.data
                                              .map(
                                                (item) => Container(
                                                  padding:
                                                      EdgeInsets.only(right: 5),
                                                  child: SizedBox(
                                                    width: 23,
                                                    height: 23,
                                                    child: ClipOval(
                                                      child: Image.network(
                                                        item.userInfo.avatar,
                                                        fit: BoxFit.cover,
                                                      ),
                                                    ),
                                                  ),
                                                ),
                                              )
                                              .toList(),
                                          Text(
                                              '共${_formData.groupManager.data.length}个组员',
                                              style: TextStyle(
                                                  fontSize: 12,
                                                  color:
                                                      rgba(107, 107, 107, 1))),
                                        ]),
                                        Container(
                                          width: 79,
                                          height: 26,
                                          decoration: BoxDecoration(
                                            borderRadius: BorderRadius.all(
                                                Radius.circular(3)),
                                            border: Border.all(
                                              color: rgba(42, 125, 250, 1),
                                              width: 1,
                                            ),
                                          ),
                                          child: GestureDetector(
                                            onTap: () =>
                                                {G.pushNamed('/group_info')},
                                            child: Row(
                                              mainAxisAlignment:
                                                  MainAxisAlignment.center,
                                              children: [
                                                Text('关于我们',
                                                    style: TextStyle(
                                                        fontSize: 13,
                                                        color: rgba(
                                                            42, 125, 250, 1)))
                                              ],
                                            ),
                                          ),
                                        ),
                                      ],
                                    ),
                                  )
                                ],
                              )),
                        ),
                      ],
                    ),
                  )
                ],
              ),
            )
          ];
        },
        body: TabBarView(
          children: tabs.map((Choice choice) {
            return tabPages[choice.position];
          }).toList(),
          controller: mTabController,
        ),
      ),
      floatingActionButton: _formData.myGroup.owner
          ? (FloatingActionButton(
              onPressed: () => print("FloatingActionButton"),
              child: IconButton(
                icon: Icon(Icons.add),
                onPressed: () => G.pushNamed('/publish_tip'),
              ),
              tooltip: "按这么长时间干嘛",
              foregroundColor: Colors.white,
              backgroundColor: Colors.blue,
              shape: CircleBorder()))
          : G.emptyBox(),
    );
  }

  @override
  void initState() {
    super.initState();
    mTabController = TabController(vsync: this, length: tabs.length);
    //判断TabBar是否切换
    mTabController.addListener(() {
      if (mTabController.indexIsChanging) {
        setState(() {
          mCurrentPosition = mTabController.index;
        });
      }
    });
    Future.delayed(Duration.zero, () {
      _loadManagers();
    });
  }

  _loadManagers() async {
    GroupFormDataModel _formData = Provider.of<GroupFormDataModel>(context);
    await _formData.getManagers();
  }

  @override
  void dispose() {
    super.dispose();
    mTabController.dispose();
  }
}

class Choice {
  const Choice({this.title, this.icon, this.position});
  final String title;
  final int position;
  final IconData icon;
}
